<html>
  <head>
    <title>Style test</title>
    <style><!--
       A { font-size: 30pt; text-decoration: none; }
       .MyClass { font-size: 25pt; }
       span { background-color: yellow; foreground-color: red; display: block; }
       //-->
    </style>
  </head>
  <body>
     <span id="myspan">text in <textarea rows="2" cols="2">textarea</textarea><hr>the span</span>
     <br>
     <a href="">30pt Font</a><br>
     <i class="MyClaSS">25pt <i>Font</i> Italic</i>
     <br>
     the following: <i style="display: block; font-size: 40pt; background-color: magenta; padding: 40px;">40pt <i>Font</i> Italic</i> should have been in a block.
     <br>
     before span <span style="font-size: 20px">20px Font</span> after span
     <script><!-- 
         var mySpan = document.getElementById('myspan');
	     mySpan.style.textDecoration = "underline";
	     //Note: IE does not give a value for backgroundColor in this case.
	     //It does if it's in the style attribute and not in the style tag.
         alert('mySpan.style.backgroundColor=' + mySpan.style.backgroundColor);
         //-->
     </script>
     <!-- Note that SPAN in the stylesheet has display:block, but this one should take precedence -->
     <span style="display: none;">THIS TEXT SHOULD BE COMPLETELY HIDDEN</span>   
     <br>
     before div <div style="display: inline;">should display inline</div> after div
  </body>
</html>